<template>
  <uv-popup
    ref="takeRef"
    mode="center"
    :overlay="false"
    :close-on-click-overlay="status == 1 ? false : true"
    :round="20"
    :z-index="8"
    bg-color="none"
    @maskClick="close"
  >
    <view class="popup-content">
      <image :src="status == 1 ? loading : status == 2 ? success : fail" />
      <view class="popup-tip"> {{ text }} </view>
      <view v-if="status == 3" class="popup-error">
        请联系 {{ cabinetInfo.contactName || "--" }}
        {{ cabinetInfo.contactNumber || "--" }}
      </view>
    </view>
  </uv-popup>
</template>
<script setup lang="ts">
import { watch, ref } from "vue";
import success from "@/static/success.png";
import loading from "@/static/loading.png";
import fail from "@/static/fail.png";
const props = defineProps({
  show: {
    type: Boolean,
    default: false,
  },
  text: {
    type: String,
    default: "加载中...",
  },
  status: {
    type: Number,
    default: 1,
  },
});
const emit = defineEmits(["update:show", "close"]);

const cabinetInfo = ref({});
const takeRef = ref(null);
const first = ref(true);

// 获取本地柜机信息
const getCabinet = () => {
  cabinetInfo.value = uni.getStorageSync("cabinet");
};

// 打开弹窗
const open = () => {
  getCabinet();
  takeRef.value.open();
};

// 关闭弹窗
const close = () => {
  if (props.status == 1) return;
  takeRef.value.close();
  emit("update:show", false);
  emit("close");
};

watch(
  () => props.show,
  (newVal) => {
    if (newVal) {
      first.value = false;
      open();
    } else {
      if (!first.value) {
        close();
      }
    }
  },
  {
    immediate: true,
    deep: true,
  }
);
</script>
<style lang="scss" scoped>
.popup-content {
  width: 312.75rpx;
  height: 312.75rpx;
  background: #fff;
  box-shadow: 0 20.85rpx 34.75rpx 0 rgba(0, 0, 0, 0.16);
  border-radius: 13.9rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  image {
    width: 134rpx;
    height: 134rpx;
  }
  .popup-tip {
    font-family: Source Han Sans;
    font-weight: 400;
    font-size: 25.02rpx;
    color: #3d3d3d;
    line-height: 36.14rpx;
    margin-top: 22.24rpx;
    text-align: center;
  }
  .popup-error {
    font-family: Source Han Sans;
    font-weight: 400;
    font-size: 22rpx;
    color: #999;
    line-height: 36.14rpx;
    margin-top: 22.24rpx;
  }
}
</style>
